body{
  background-color: hsl(0, 0%, 10%);
}
.to-do-list{
  font-family: Arial,sans-serif;
  text-align: center;
  margin-top: 100px;
}
h1{
  font-size: 4rem;
  color: white;
}
button{
  font-size: 1.7rem;
  font-weight: bold;
  padding: 10px 20px;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.5s ease;
}
.add-button{
  background-color: hsla(120, 56%, 51%, 0.573);
}
.add-button:hover{
  background-color: hsla(120, 56%, 51%, 0.373);
}

.delete-button{
  background-color: hsla(0, 90%, 51%, 0.573);
}
.delete-button:hover{
  background-color: hsla(0, 90%, 51%, 0.373); 
}

.move-button{
  background-color: hsla(241, 96%, 48%, 0.573);
}
.move-button:hover{
  background-color: hsla(241, 96%, 48%, 0.373);
}

input[type="text"]{
  font-size: 1.6rem;
  padding: 10px 20px;
  border: 2px solid hsl(0, 0%, 40%);
  border-radius: 5px;
  color: hsl(0, 0%, 50%);
}

ol{
  padding: 0;
}
li{
  font-size: 2rem;
  font-weight: bold;
  padding: 15px;
  background-color: hsl(0, 0%, 97%);
  margin-bottom: 10px;
  border: 3px solid hsla(0, 0%, 85%, 0.75);
  border-radius: 5px;
  display: flex;
  align-items: center;
}

.text{
  flex: 1;
}

.delete-button,.move-button{
  padding: 8px 12px;
  font-size: 1.4rem;
  margin-left: 10px;
}